import React, { Component } from 'react'
import Info from "components/info";
import { Button, message, Popconfirm, Radio, Spin } from "antd";
import { messages } from "share/common";
import ListSelector from "components/list-selector";
import companyAccountSettingService from "./company-account-setting.service";
import AdvanceTable from 'components/advanced-table';
import httpFetch from "share/httpFetch";

class AssignCompany extends Component {

  state = {
    showListSelector: false,
    assignLoading: false,
    radioValue: '03',
    radioLoading: false
  };

  service = (page, pageSize) => {
    const { id, accountType } = this.props;
    return companyAccountSettingService.getCompanyList({  page, size: pageSize, bankAccountId: id, accountType })
  };

  componentDidMount() {
    this.getDefaultRadio();
  }

  getDefaultRadio = () => {
    const { id, accountType } = this.props;
    this.setState({ radioLoading: true });
    companyAccountSettingService.getDefaultRadio(id, accountType).then(res => {
      this.setState({ radioLoading: false, radioValue: res.data.paymentAuthType });
    }).catch(e => {
      this.setState({ radioLoading: false });
      message.error(e.response.data.message)
    })
  };

  handleChangeRadio = e => {
    const { id, accountType } = this.props;
    let radioValue = e.target.value;
    this.setState({ radioLoading: true });
    companyAccountSettingService.saveDefaultRadio({
      bankAccountId: id,
      paymentAuthType: radioValue,
      accountType
    }).then(() => {
      this.setState({ radioValue, radioLoading: false });
    }).catch(e => {
      this.setState({ radioLoading: false });
      message.error(e.response.data.message);
    });
  };

  handleAdd = result => {
    const { id, accountType } = this.props;
    this.setState({ assignLoading: true });
    let temp = [];
    result.result.map(item => {
      temp.push({
        bankAccountId: id,
        companyId: item.id,
        companyCode: item.companyCode,
        companyName: item.name,
        accountType
      })
    });
    companyAccountSettingService.saveAddCompany(temp).then(() => {
      this.setState({ assignLoading: false, showListSelector: false }, () => {
        this.tableRef.getList();
      });
    }).catch(e => {
      this.setState({ assignLoading: false });
      message.error(e.response.data.message);
    })
  };

  handleDelete = (e, record) => {
    httpFetch.delete(`/api/companyBankAuth/paymentCompany/companyAuth/delete?id=${record.id}`).then(() => {
      message.success(messages('common.operate.success')/*操作成功*/);
      this.tableRef.getList();
    }).catch(e => {
      message.error(e.response.data.message);
    })
  };

  render() {
    const { radioLoading, radioValue, assignLoading, showListSelector } = this.state;
    const { id, setOfBooksId, accountType, disabled } = this.props;
    return (
      <div className='assign-company' style={accountType === 'ALIPAY_LOGON_ID' ? { height: '100%' } : {}}>
        <AdvanceTable.SimpleTable
          columns={[
            { title: messages('finance-4.key357')/*被授权单据公司代码*/, dataIndex: 'companyCode' },
            { title: messages('finance-4.key358')/*被授权单据公司名称*/, dataIndex: 'companyName' },
            {
              dataIndex: 'operator', title: messages('common.operation')/*操作*/,
              render: (value, record) => <Popconfirm onConfirm={e => this.handleDelete(e, record)} title={messages('finance-4.key359')/*确定删除嘛*/}>
                <a>{messages('common.delete')/*删除*/}</a>
              </Popconfirm>
            }
          ]}
          searchForm={[]}
          service={this.service}
          onRef={ref => this.tableRef = ref}
          rowKey='id'
        >
          <Info
            dataSource={{ description: messages('finance-4.key360')/*授权此账号可支付的业务单据的所属公司*/ }}
            attributes={[{
              title: messages('finance-4.key351')/*设置说明*/, dataIndex: 'description', span: 24
            }]}
          />
          <Spin spinning={radioLoading}>
            <span>授权范围: </span>
            <Radio.Group value={radioValue} onChange={this.handleChangeRadio} disabled={disabled}>
              <Radio value={'01'}>{messages('finance-4.key361')/*同帐套公司*/}</Radio>
              <Radio value={'02'}>{messages('finance-4.key362')/*本公司*/}</Radio>
              <Radio value={'03'}>{messages('finance-4.key363')/*部分公司*/}</Radio>
            </Radio.Group>
          </Spin>
          <div style={{ marginBottom: '10px' }}>
            <Button type="primary" onClick={() => this.setState({ showListSelector: true })} disabled={radioValue !== '03' || disabled}>{messages('common.add')/*添加*/}</Button>
          </div>
        </AdvanceTable.SimpleTable>
        <ListSelector
          visible={showListSelector}
          onOk={this.handleAdd}
          confirmLoading={assignLoading}
          onCancel={() => this.setState({ showListSelector: false })}
          type={'company_budget'}
          extraParams={{
            setOfBooksId,
            bankAccountId: id
          }}
        />
      </div>
    )
  }

}

export default AssignCompany
